<template>
	<el-card>
		<el-form :inline="true">
			<el-form-item label="关键词:">
				<el-date-picker v-model="queryParams.settingYear" type="year" format="YYYY" value-format="YYYY" style="width: 100%" />
			</el-form-item>
			<el-form-item>
				<el-button icon="Search" type="primary" @click="handleSearch">查询</el-button>
			</el-form-item>
			<el-form-item>
				<el-button icon="RefreshRight" @click="handleReset">重置</el-button>
			</el-form-item>
		</el-form>
	</el-card>

	<el-card>
		<el-table
			v-loading="loading"
			:data="dataList"
			stripe
			element-loading-background="rgba(0, 0, 0, 0.5)"
			element-loading-text="加载中..."
			header-row-class-name="table-header"
		>
			<el-table-column type="index" label="序号" header-align="center" align="center" width="60"></el-table-column>
			<el-table-column label="申报年度" align="center" prop="settingYear" />
			<el-table-column label="编制类型" align="center" prop="preparationType"> </el-table-column>
			<el-table-column label="截止日期" align="center" prop="deadLineTime"> </el-table-column>
			<el-table-column label="编制阶段的截止时长(月)" align="center" prop="deadLineMonth"> </el-table-column>
			<el-table-column label="截止日期(天)" align="center" prop="deadLineDay"> </el-table-column>
			<el-table-column label="创建时间" align="center" prop="createTime"> </el-table-column>
			<el-table-column label="创建人" align="center" prop="createBy"> </el-table-column>
			<el-table-column label="启用状态" align="center" prop="activeStatus"> </el-table-column>
			<el-table-column label="操作" fixed="right" header-align="center" align="center" width="80">
				<template #default="scope">
					<el-icon class="cursor" title="做废" :size="16" color="#fe6360" @click="handleDelete(scope.row)"><CircleClose /></el-icon>
				</template>
			</el-table-column>
		</el-table>

		<el-pagination
			:current-page="pageInfo.pageIndex"
			:page-size="pageInfo.pageSize"
			:total="pageInfo.total"
			layout="total, sizes, prev, pager, next, jumper"
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange"
		>
		</el-pagination>
	</el-card>
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { min } from 'xe-utils'
import { querylistApi, saveOrUpdateApi, deleteApi } from '@/api/system/deadlineTime'
const queryParams = ref({ settingYear: '', activeStatus: '', stageCode: '', remark: '', preparationType: '' })
const defaultFilter = ref({ settingYear: '', activeStatus: '', stageCode: '', remark: '', preparationType: '' })
const queryForm = ref()
const datatimelist = ref([])
const dataList = ref([])
const pageInfo = ref({ pageIndex: 1, pageSize: 10, total: 0 })
const loading = ref(false)
const handleSearch = () => {
	getDataList()
}

const handleReset = () => {
	queryParams.value = { ...defaultFilter.value }
	pageInfo.value.pageIndex = 1
	dataList.value = []
	getDataList()
}
onMounted(() => {
	getDataList()
})

const getDataList = () => {
	loading.value = true

	const data = { ...queryParams.value, pageIndex: pageInfo.value.pageIndex, pageSize: pageInfo.value.pageSize }

	querylistApi(data).then(res => {
		loading.value = false
		dataList.value = res.data.list || []
		pageInfo.value.total = res.data.total || 0
	})
}

// const handlePaginationChange = ({ page, size }: { page: number; size: number }) => {
//   pageInfo.value.page = page;
//   pageInfo.value.limit = size;
//   list.value = [];
//   getuser_list();
// };
const handleSizeChange = (val: number) => {
	pageInfo.value.pageSize = val
	dataList.value = []
	getDataList()
}
const handleCurrentChange = (val: number) => {
	pageInfo.value.pageIndex = val
	dataList.value = []
	getDataList()
}
</script>

<style lang="scss" scoped></style>
